<!doctype html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
	    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width,height=device-height">
        <title>首页</title>
        <link href="favicon.ico" rel="shortcut icon">
        <link rel="stylesheet" href="css/common/swiper.css">
        <link rel="stylesheet" href="css/common/base.css">
        <link rel="stylesheet" href="css/common/animation.css">
        <link rel="stylesheet" href="css/index/style.css">
        <link rel="stylesheet" href="css/common/media.css">
        <link rel="stylesheet" href="css/index/media.css">
        <link rel="stylesheet" href="css/index/animation.css">
    </head>
    <body id="large-header">
        <div class="beginning left flex flex-align-items">
                <i class="line top"></i>
                <i class="line bottom"></i>
                <img src="img/common/beginningLogo.png" alt="入场logo图">
        </div>
        <div class="beginning right flex flex-align-items">
                <i class="line top"></i>
                <i class="line bottom"></i>
                <img src="img/common/beginningLogoTxt.png" alt="入场logo文字">
        </div>

        <div class="container horizontal">
            <header>
                <div class="ready navSide fixed menu">
                        <div class='navBtn'>
                            <img src="img/common/aboutBtn.png" alt="about导航按钮">
                            <p class="btnTip"><span>MENU</span><span>返回</span></p>
                        </div>
                        <nav class="flex">
                            <p><span><img src="img/common/navLogo.jpg" alt="导航栏logo"></span></p>
                            <div class="contn flex" dir='rtl'>
                                <div class="box">
                                    <div class="middle">
                                        <ul>
                                            <li>
                                                <div class="col">
                                                    <a href="index.html">首页</a>
                                                </div>
                                                
                                            </li>
                                            <li class="active">
                                                <div class="col">
                                                    <p>商业空间<span class="unclick">+</span><span class="click">-</span></p>
                                                    <i class="line"></i>
                                                    <div class="sonMenu">
                                                        <ul>
                                                            <li class="active"><a href="commercialSpace.html"><span>民宿设计</span></a></li>
                                                            <li><a href="commercialSpace.html"><span>酒吧设计</span></a></li>
                                                            <li><a href="commercialSpace.html"><span>办公设计</span></a></li>
                                                            <li><a href="commercialSpace.html"><span>会所设计</span></a></li>
                                                            <li><a href="commercialSpace.html"><span>样板房设计</span></a></li>
                                                            <li><a href="commercialSpace.html"><span>售楼处设计</span></a></li>
                                                            <li><a href="commercialSpace.html"><span>寺院设计</span></a></li>
                                                            <li><a href="commercialSpace.html"><span>酒店设计</span></a></li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                
                                            </li>
                                            <li>
                                                <div class="col">
                                                    <p>书店设计<span class="unclick">+</span><span class="click">-</span></p>
                                                    <i class="line"></i>
                                                    <div class="sonMenu">
                                                        <ul>
                                                            <li><a href="bookstoreDesign.html"><span>书店设计1</span></a></li>
                                                            <li><a href="bookstoreDesign.html"><span>书店设计2</span></a></li>
                                                            <li><a href="bookstoreDesign.html"><span>书店设计3</span></a></li>
                                                            <li><a href="bookstoreDesign.html"><span>书店设计4</span></a></li>
                                                            <li><a href="bookstoreDesign.html"><span>书店设计5</span></a></li>
                                                            <li><a href="bookstoreDesign.html"><span>书店设计6</span></a></li>
                                                            <li><a href="bookstoreDesign.html"><span>书店设计7</span></a></li>
                                                            <li><a href="bookstoreDesign.html"><span>书店设计8</span></a></li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                
                                            </li>
                                            <li> 
                                                <div class="col">
                                                    <p>景观设计<span class="unclick">+</span><span class="click">-</span></p>
                                                    <i class="line"></i>
                                                    <div class="sonMenu">
                                                        <ul>
                                                            <li><a href="landscapeDesign.html"><span>景观设计1</span></a></li>
                                                            <li><a href="landscapeDesign.html"><span>景观设计2</span></a></li>
                                                            <li><a href="landscapeDesign.html"><span>景观设计3</span></a></li>
                                                            <li><a href="landscapeDesign.html"><span>景观设计4</span></a></li>
                                                            <li><a href="landscapeDesign.html"><span>景观设计5</span></a></li>
                                                            <li><a href="landscapeDesign.html"><span>景观设计6</span></a></li>
                                                            <li><a href="landscapeDesign.html"><span>景观设计7</span></a></li>
                                                            <li><a href="landscapeDesign.html"><span>景观设计9</span></a></li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                
                                            </li>
                                            <li>
                                                <div class="col">
                                                    <a href="softLoadingDesign.html">软装设计</a>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="col">
                                                    <a href="graphicDesign.html">平面设计</a>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="col">
                                                    <a href="cases.html">全部案例</a>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="col">
                                                    <a href="news.html">新闻中心</a>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="col">
                                                    <a href="about.html">关于我们</a>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                
                            </div>
                            
                        </nav>
                </div>
                
            </header>
            <main>
                <div class="headSwiper">
                    <div class="swiper-container">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide"><img src="img/index/headSlide1.jpg" alt="轮播图"></div>
                            <div class="swiper-slide"><img src="img/index/headSlide2.jpg" alt="轮播图"></div>
                            <div class="swiper-slide"><img src="img/index/headSlide3.jpg" alt="轮播图"></div>
                            <div class="swiper-slide"><img src="img/index/headSlide4.jpg" alt="轮播图"></div>
                            <div class="swiper-slide"><img src="img/index/headSlide5.jpg" alt="轮播图"></div>
                        </div>
                        <div class="swiper-pagination head-pagination"></div>
                    </div>
                </div>
                <div class="about ready">
                    <div class="fluid">
                        <a href="about.html" class="book needHover autoAnimate disorder scrollItem" data-bottom-top="transform:translate(0,200px)" data-top-bottom="transform:translate(0,-100px)">
                            <p class="flex">Hello<span>关于我们</span></p>
                            <span class="border auto top horizontal"><i></i></span>
                            <span class="border auto right vertical"><i></i></span>
                            <span class="border auto bottom horizontal"><i></i></span>
                            <span class="border auto left vertical"><i></i></span>
                        </a>
                        <nav class="scrollItem" data-bottom-top="transform:translate(0,70px)" data-top-bottom="transform:translate(0,-100px)">
                            <h4>我们发展</h4>
                            <ul>
                                <li><a class="flex flex-align-items" href="commercialSpace.html"><i class="line"></i>商业空间</a></li>
                                <li><a class="flex flex-align-items" href="bookstoreDesign.html"><i class="line"></i>书店设计</a></li>
                                <li><a class="flex flex-align-items" href="landscapeDesign.html"><i class="line"></i>景观设计</a></li>
                                <li><a class="flex flex-align-items" href="softLoadingDesign.html"><i class="line"></i>软装设计</a></li>
                                <li><a class="flex flex-align-items" href="graphicDesign.html"><i class="line"></i>平面设计</a></li>
                            </ul>
                        </nav>
                        <div class="logo">
                            <p><img src="img/index/aboutLogo.png" alt="logo图" class="scrollItem contrary" data-bottom-top="transform:translate(0,-60px)" data-top-bottom="transform:translate(0,10px)"></p>
                        </div>
                        <div class="contn">
                            <div class="content needHover hoverFather scrollItem"  data-bottom-top="transform:translate(0,50px)" data-top-bottom="transform:translate(0,-400px)">
                                <div class="pic">
                                    <img src="img/index/aboutImg.png" alt="关于我们插图">
                                    <div class="txt scrollItem hoverSon" data-bottom-top="transform:translate(0,500px)" data-top-bottom="transform:translate(0,-300px)">
                                        <i class="line"></i>
                                        <p>宁波吉曼环境艺术设计有限公司，是宁波一家专业的文化空间设计公司。</p>
                                        <p>专注办公室空间设计.办公楼设计.样板房设计.厂房空间设计.别墅设计</p>
                                        <p>酒店设计.KTV设计.餐厅设计.服装店等店面设计.咖啡店设计等设计领域。</p>
                                        <a href="about.html" class="more order autoAnimate">
                                            <span class="border auto top horizontal"></span>
                                            <span class="border auto right vertical"></span>
                                            <span class="border auto bottom horizontal"></span>
                                            <span class="border auto left vertical"></span>
                                            <p class="noBg">
                                                查看更多&nbsp;&nbsp;&nbsp;&nbsp;>>
                                            </p>
                                            <p class="haveBg">
                                                <i>查看更多&nbsp;&nbsp;&nbsp;&nbsp;>></i>
                                            </p>
                                        </a>
                                    </div>
                                </div>
                                
                                <span class="border hover top horizontal"></span>
                                <span class="border hover right vertical"></span>
                                <span class="border hover bottom horizontal"></span>
                                <span class="border hover left vertical"></span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tip ready">
                    <div class="fluid">
                        <div class="box">
                            <div class="txt top">
                                <i class="line"></i>
                                <p>绿色环保</p>
                                <h2>专注书店设计</h2>
                                <p>自成一派</p>
                            </div>
                        </div>
                        <div class="box">
                            <div class="txt bottom">
                                <span>J.M DESIGN</span>
                                <i class="line"></i>
                                <p>我们将建筑.城市.人三者之间互相关系用设 计表现出来。我们注
                                    重团队配合.勇于创新. 呈现城市多元化和综合性。</p>
                                
                            </div>
                        </div>
                    </div>
                    <img src="img/index/tipBG.jpg" class="trans" alt="标语背景图">
                </div>
                <div class="case">
                    <div class="fluid">
                        <div class="row ready roll">
                            <div class="box">
                                <a href='bookstoreDesign.html' class="book needHover autoAnimate disorder scrollItem" data-bottom-top="transform:translate(0,200px)" data-top-bottom="transform:translate(0,-100px)">
                                    <p class="flex">CASE<span>书店设计</span></p>
                                    <span class="border auto top horizontal"><i></i></span>
                                    <span class="border auto right vertical"><i></i></span>
                                    <span class="border auto bottom horizontal"><i></i></span>
                                    <span class="border auto left vertical"><i></i></span>
                                </a>
                            </div>
                            <div class="box">
                                <div class='examples'>
                                    <p class="scrollItem" data-bottom-top="transform:translate(0,200px)" data-top-bottom="transform:translate(0,-100px)"><span class="num">27</span><span>个案例</span></p>
                                    <ul>
                                        <li class="scrollItem" data-bottom-top="transform:translate(0,200px)" data-top-bottom="transform:translate(0,-200px)">
                                            <p class="num">6</p>
                                            <p>大地方性书城</p>
                                        </li>
                                        <li class="scrollItem" data-bottom-top="transform:translate(0,150px)" data-top-bottom="transform:translate(0,-150px)">
                                            <p class="num">14</p>
                                            <p>个地区</p>
                                        </li>
                                        <li class="scrollItem" data-bottom-top="transform:translate(0,100px)" data-top-bottom="transform:translate(0,-100px)">
                                            <p class="num">6</p>
                                            <p>家年轮书店</p>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="row details scrollItem" data-bottom-top="transform:translate(0,100px)" data-top-bottom="transform:translate(0,-150px)">
                            <p>全部案例</p>
                            <ul>
                                <li><a href="example.html"><span class="line"></span>宁波书城</a></li>
                                <li><a href="example.html"><span class="line"></span>鄞州书城</a></li>
                                <li><a href="example.html"><span class="line"></span>余姚书城</a></li>
                                <li><a href="example.html"><span class="line"></span>慈溪书城</a></li>
                                <li><a href="example.html"><span class="line"></span>象山书城</a></li>
                                <li><a href="example.html"><span class="line"></span>宁波报业集团新华书店</a></li>
                                <li><a href="example.html"><span class="line"></span>宁波芝士公园新华书店</a></li>
                                <li><a href="example.html"><span class="line"></span>宁波北岸财富中心音乐酒吧</a></li>
                                <li><a href="example.html"><span class="line"></span>青岛天一书店</a></li>
                                <li><a href="example.html"><span class="line"></span>宁海西子园国际新华书店</a></li>
                                <li><a href="example.html"><span class="line"></span>北仑读一书店</a></li>
                                <li><a href="example.html"><span class="line"></span>绍兴书吧</a></li>
                            </ul>
                            <a href="bookstoreDesign.html" class="more order autoAnimate">
                                <span class="border auto top horizontal"></span>
                                <span class="border auto right vertical"></span>
                                <span class="border auto bottom horizontal"></span>
                                <span class="border auto left vertical"></span>
                                <p class="noBg">
                                    查看更多&nbsp;&nbsp;&nbsp;&nbsp;>>
                                </p>
                                <p class="haveBg">
                                    <i>查看更多&nbsp;&nbsp;&nbsp;&nbsp;>></i>
                                </p>
                            </a>
                        </div>
                        <div class="row swiper ready scrollItem" data-bottom-top="transform:translate(0,100px)" data-top-bottom="transform:translate(0,-100px)">
                            <div class="swiper-container caseSwiper">
                                <div class="swiper-wrapper">
                                    <a class="swiper-slide"><img src="img/index/caseSlide.jpg" alt="轮播图"></a>
                                    <a class="swiper-slide"><img src="img/index/caseSlide.jpg" alt="轮播图"></a>
                                    <a class="swiper-slide"><img src="img/index/caseSlide.jpg" alt="轮播图"></a>
                                    <a class="swiper-slide"><img src="img/index/caseSlide.jpg" alt="轮播图"></a>
                                </div>
                                <div class="swiperBtn swiper-button-prev case-prev"></div>
                                <div class="swiperBtn swiper-button-next case-next"></div>
                                <div class="swiper-pagination case-pagination"></div>
                            </div>
                            <div class="btns">
                                <div class="swiperBtn swiper-button-prev case-prev"></div>
                                <div class="swiperBtn swiper-button-next case-next"></div>
                                <div class="swiper-pagination case-pagination">
                                    <span class="swiper-pagination-bullet swiper-pagination-bullet-active"></span>
                                    <span class="swiper-pagination-bullet"></span>
                                    <span class="swiper-pagination-bullet"></span>
                                    <span class="swiper-pagination-bullet"></span>
                                </div>
                            </div>
                            <div class="title">
                                <span class="line"><i></i></span>
                                <p>鄞州书城</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="introduce fluid">
                    <div>
                        <img src="img/index/creator.jpg" alt="创始人照片">
                        <div class="content autoAnimate disorder scrollItem" data-bottom-top="transform:translate(0,250px)" data-top-bottom="transform:translate(0,-150px)">
                            <span>创始人</span>
                            <span class="line"></span>
                            <h1>某某某先生</h1>
                            <p>宁波吉曼环境艺术设计有限公司，是宁波一家专业的文化空间设计公司。</p>
                            <p>专注办公室空间设计.办公楼设计.样板房设计.厂房空间设计.别墅设计</p>
                            <p>酒店设计.KTV设计.餐厅设计.服装店等店面设计.咖啡店设计等设计领域</p>
                            <span class="border auto top horizontal"></span>
                            <span class="border auto right vertical"></span>
                            <span class="border auto bottom horizontal"></span>
                            <span class="border auto left vertical"></span>
                        </div>
                    </div>
                    <div>
                        <a href="designer.html" class="more order autoAnimate">
                            <span class="border auto top horizontal"></span>
                            <span class="border auto right vertical"></span>
                            <span class="border auto bottom horizontal"></span>
                            <span class="border auto left vertical"></span>
                            <p class="noBg">
                                查看更多&nbsp;&nbsp;&nbsp;&nbsp;>>
                            </p>
                            <p class="haveBg">
                                <i>查看更多&nbsp;&nbsp;&nbsp;&nbsp;>></i>
                            </p>
                        </a>
                    </div>
                </div>
                <div class="news fluid">
                    <i class="line"></i>
                    <p class="flex">
                        <span>NEWS</span>
                        <span>新闻中心</span>
                    </p>
                    <ul class="ready scrollItem" data-top-bottom="transform:translate(0,-50)" data-bottom-top="transform:translate(0,50px)">
                        <li>
                            <a href="newsInfo.html">
                                <p class="pic">
                                    <img src="img/index/newsImg.jpg" alt="新闻插图">
                                </p>
                                <div class="content">
                                    <h5>新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题</h5>
                                    <div class="txt">
                                        <span class="date">2019-08-15</span>
                                        <p>新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介
                                            新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简</p>
                                    </div>
                                    <span class="moreInfo">查看更多</span>
                                </div>
                            </a>
                        </li>
                        <li>
                            <a href="newsInfo.html">
                                <p class="pic">
                                    <img src="img/index/newsImg.jpg" alt="新闻插图">
                                </p>
                                <div class="content">
                                    <h5>新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题</h5>
                                    <div class="txt">
                                        <span class="date">2019-08-15</span>
                                        <p>新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介
                                            新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简</p>
                                    </div>
                                </div>
                            </a>
                        </li>
                            
                        <li>
                            <a href="newsInfo.html">
                                <p class="pic">
                                    <img src="img/index/newsImg.jpg" alt="新闻插图">
                                </p>
                                <div class="content">
                                    <h5>新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题</h5>
                                    <div class="txt">
                                        <span class="date">2019-08-15</span>
                                        <p>新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介
                                            新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简介新闻简</p>
                                    </div>
                                </div>
                            </a>
                        </li>
                    </ul>
                    <a href="news.html" class="more autoAnimate order">
                        <span class="border auto top horizontal"></span>
                        <span class="border auto right vertical"></span>
                        <span class="border auto bottom horizontal"></span>
                        <span class="border auto left vertical"></span>
                        <p class="noBg">
                            查看更多&nbsp;&nbsp;&nbsp;&nbsp;>>
                        </p>
                        <p class="haveBg">
                            <i>查看更多&nbsp;&nbsp;&nbsp;&nbsp;>></i>
                        </p>
                    </a>
                </div>
                
            </main>
            <footer>
                <div class="contact appear">
                    <div class="head">
                        <p class="fluid flex">
                            <span class="eng">CONTACT</span>
                            <span class="chn">联系我们</span>
                            <span class="cell">
                                0587-86989308
                                <i class="border top horizontal"></i>
                                <i class="border right vertical"></i>
                                <i class="border bottom horizontal"></i>
                                <i class="border left vertical"></i>
                            </span>
                        </p>
                    </div>
                    <div class="form fluid">
                        <form action="">
                            <div class="row">
                                <p><label for="name1">姓名：</label><input type="text" id="name1"></p>
                                <p><label for="name2">姓名：</label><input type="text" id="name2"></p>
                                <p><label for="name3">姓名：</label><input type="text" id="name3"></p>
                            </div>
                            <p><label for="name4">姓名：</label><input type="text" id="name4"></p>
                        </form>
                        <p><button class="submit">提交</button></p>
                    </div>
                </div>
                <div class='footage'>
                    <div class="fluid">
                        <ul>
                            <li><img src="img/common/footLogo.png" alt="底部logo图"></li>
                            <li>
                                <p class="title flex flex-align-items"><i class="line"></i>TEL</p>
                                <span>0574-86989308</span>
                            </li>
                            <li>
                                <p class="title flex flex-align-items"><i class="line"></i>E-MAIL</p>
                                <span>912900934@qq.com</span>
                            </li>
                            <li>
                                <p class="title flex flex-align-items"><i class="line"></i>ADD</p>
                                <span>浙江省宁波市鄞州区</span>
                                <span>腊梅路515号迪信通E10广场</span>
                                <span>2号楼804-2</span>
                            </li>
                        </ul>
                        <p>©2019 宁波吉曼环境艺术设计有限公司
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                            技术支持：穿石科技</p>
                    </div>
                </div>
            </footer>
            
        </div>
         <canvas class="shave" id="demo-canvas"></canvas>
        
        
        
        
        <script src="js/common/swiper.js"></script>
        <script src="js/common/jquery.js"></script>
        
        <script src="js/common/common.js"></script>
        <script src="js/index/index.js"></script>
        <script src="js/common/animation.js"></script>
        <script src="js/index/animation.js"></script>
        <script src="js/index/TweenLite.min.js"></script>
        <script src="js/index/EasePack.min.js"></script>
        <script src="js/index/demo-1.js"></script>


    </body>
</html>